import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
  Image,
  ToastAndroid
} from 'react-native';


import pxToDp from '../../../utils/pxToDp'


export default class Status extends Component{
	constructor(props){
		super(props)
		this.state = {
			menus:[
				{value:0,item:'全部'},
				{value:1,item:'待审批'},
				{value:2,item:'待预定'},
				{value:3,item:'已完成'},
			],
			active:0,
		};
	}
	switchState(value){		 
		this.setState({
			active:value
		})
	}
	render(){
		return (
			<View style={styles.container}>
				{
					this.state.menus.map((menu) => {
						return <Text 
										onPress={() => this.switchState(menu.value)} 
										style={[styles.item,this.state.active==menu.value?styles.active:""]}>
										{menu.item}
									</Text>
					})
				}
				
			</View>
		)
	}
}


const styles = StyleSheet.create({
  container:{
  	height:pxToDp(89),
  	borderBottomWidth:1,
  	borderStyle:'solid',
  	borderBottomColor:'#f65859',
  	flexDirection:'row',
  	justifyContent:'space-between',
  	backgroundColor:'white',
  },
  item:{
  	fontSize:pxToDp(28),
  	textAlign:'center',
  	lineHeight:pxToDp(65),
  	flexGrow:1,
  	
  },
  active:{
  	borderBottomWidth:3,
  	borderStyle:'solid',
  	borderBottomColor:'#f65859',
  }
  
  
});